<template>
    <div>
        <van-row>
          <van-col span="20" class="listHeight">use english</van-col>
          <van-col span="4" class="listHeight">
              <van-switch
                v-model="checked1"
                size="24px" @change="useEng"
                />
          </van-col>
        </van-row>
        <van-row>
          <van-col span="20" class="listHeight">使用繁体字</van-col>
          <van-col span="4" class="listHeight">
              <van-switch
                v-model="checked2"
                size="24px"
                />
          </van-col>
        </van-row>
        <van-row>
          <van-col span="20" class="listHeight">使用简体字</van-col>
          <van-col span="4" class="listHeight">
              <van-switch
                v-model="checked3"
                size="24px"
                />
          </van-col>
        </van-row>
        <button type="primary" @click="jump">主页</button>
        <div class="box">huhu</div>
    </div>
</template>
<script>
export default {
    data(){
        return {
            checked1:false ,
            checked2:false ,
            checked3:false ,
            checked4:false ,
        }
    },
    methods:{
        useEng(bol){
            if(bol){
                this.$i18n.locale='en'
                this.$Local('en')
            }else{
                this.$i18n.locale='cn'
                this.$Local('cn')
            }
        },
        jump(){
            this.$router.push('/')
        }
    }
}
</script>
<style scoped lang="less">
@import "../less/const.less";

.listHeight{
    font-size:14px;
    height:24px;
    line-height:24px;
    margin-top:5px;
}
.box{
    width:@w30;
    height:@h30;
    background:@bg;
}
</style>

